// @ts-nocheck
import React, {useEffect, useState} from 'react';
import {PageContainer} from '@ant-design/pro-layout';
import {Avatar, Card, Row, Col, Divider, Button} from 'antd';
import {ShoppingCartOutlined, SolutionOutlined, CustomerServiceOutlined, AlertOutlined} from '@ant-design/icons'
import {useModel, history} from 'umi';
import styles from './Welcome.less';
import moment from "moment";

const Welcome: React.FC = () => {
  const init = useModel('@@initialState');
  const {currentUser} = init.initialState
  const [date, setDate] = useState(null)
  useEffect(() => {
    setInterval(() => {
      setDate(moment().format('YYYY-MM-DD HH:mm:ss'))
    }, 1000)
  }, [])
  const Good = () => {
    const currentDate = new Date();
    let content = '';
    const hours = currentDate.getHours();
    if (hours >= 0 && hours <= 10) {
      content = `早上好`;
    } else if (hours > 10 && hours <= 14) {
      content = `中午好`;
    } else if (hours > 14 && hours <= 18) {
      content = `下午好`;
    } else if (hours > 18 && hours <= 24) {
      content = `晚上好`;
    }
    return content;
  };
  const getCurrentYear = () => {
    const currentDate = new Date();
    const year = currentDate.getFullYear();
    const isLeap = (0 === year % 4) && (0 === year % 100) || (0 === year % 400);
    const days = isLeap ? 366 : 365;
    const date2 = new Date(year, 11, 30, 23, 59, 59, 999);
    const time = (date2 - currentDate) / 1000;
    const day = Math.floor(time / (24 * 60 * 60));
    const _ = days - day;
    return year + '年已过' + _ + '天,还剩' + day + '天';
  };

  const Header = (user: { avatar: boolean | React.ReactChild | React.ReactFragment | React.ReactPortal | null | undefined; username: boolean | React.ReactChild | React.ReactFragment | React.ReactPortal | null | undefined; }) => {
    return (
      <div className={styles.pageHeaderContent}>
        <div className={styles.avatar}>
          <Avatar size='large' src={user.avatar}/>
        </div>
        <div className={styles.content}>
          <div className={styles.contentTitle}>
            {Good()}，
            {user.username}
            ，祝你开心每一天！
          </div>
          <div>
            {getCurrentYear()}&ensp;&ensp;
            <span>当前时间:{date}</span>
          </div>
        </div>
      </div>
    );
  };
  return (
    <PageContainer content={Header(currentUser)}>
      <Row gutter={8}>
        <Col span={14}>
          <Card
            hoverable
            title='简介'
          >
            <p>
            辽宁云鼎网络科技有限公司成立于2016年，公司注册资金1050万。是东北地区具有重要影响力的IDC服务提供商，也是东北地区领先的第三方中立数据中心运营商。作为卓越的互联互通网络平台，云鼎网络致力于提供业界领先的数据中心服务、并率先倡导和实施IDC+重科技创新，打造具有核心技术、超大规模运营能力的网络空间基础设施运营平台。依托在数据中心建设、网络连接等方面的经验优势，通过全连接将数据中心从高品质时代引入高能时代。
            </p>
            <Divider/>
            <p>
              计费运维平台基础版 当前版本：1.0.0。
            </p>
          </Card>
        </Col>
        <Col span={10}>
          <Card
            hoverable
            title='快速开始/便捷导航'
          >
            <Row gutter={8}>
              <Col span={6}>
                <Button onClick={() => history.push('/system/authority')} type="primary" icon={<AlertOutlined/>}
                        size={'large'}>
                  权限管理
                </Button>
              </Col>
              <Col span={6}>
                <Button onClick={() => history.push('/business/client')} type="primary"
                        icon={<CustomerServiceOutlined/>} size={'large'}>
                  客户管理
                </Button>
              </Col>
              <Col span={6}>
                <Button onClick={() => history.push('/business/contract')} type="primary" icon={<SolutionOutlined/>}
                        size={'large'}>
                  合同管理
                </Button>
              </Col>
              <Col span={6}>
                <Button onClick={() => history.push('/system/package')} type="primary" icon={<ShoppingCartOutlined/>}
                        size={'large'}>
                  套餐管理
                </Button>
              </Col>
            </Row>
          </Card>
        </Col>
      </Row>
    </PageContainer>
  );
};

export default Welcome;
